<template>
  <div class="container">
      <el-dialog
  title="订单详情"
  :visible.sync="dialogShow"
  width="1000px">
   <div class="content">
      <div class="code">
        <span>订单号：</span>
        <span>202011098855669922</span>
      </div>
      <div class="info">
        <el-col :span="8">
          <span>购买用户：</span>
          <span>张1（13298187190）</span>
        </el-col>

        <el-col :span="8">
         <span>所属企业：</span>
          <span>河南省投资集团</span>
        </el-col>
      </div>

      <div class="info">
        <el-col :span="8">
          <span>支付金额：</span>
          <span>588.00元</span>
        </el-col>
         <el-col :span="8">
          <span>支付方式：</span>
          <span>支付宝</span>
        </el-col>
        <el-col :span="8">
         <span>支付时间：</span>
          <span>2020-10-28 08:09:09</span>
        </el-col>
      </div>
   </div>

  <div class="detailed">
    <div class="wxkj-icon-title mb20 mt30">
      <span class="icon"></span>
      <span>权益明细</span>
     </div>
     <el-table
    :data="tableData"
    border
    style="width: 100%">
    <el-table-column 
    align="center"
      label="价格">
    </el-table-column>
    <el-table-column
    align="center" label="在线职位数">
    </el-table-column>
    <el-table-column
    align="center"
      label="职位刷新频次">
    </el-table-column>
    <el-table-column
    align="center"
      label="下载简历量">
    </el-table-column>
    <el-table-column
    align="center"
      label="权益有效起止日期">
    </el-table-column>
  </el-table>
  </div>

  <span slot="footer" class="dialog-footer">
    <el-button @click="dialogShow = false">取 消</el-button>
    <el-button type="primary" @click="dialogShow = false">确 定</el-button>
  </span>
</el-dialog>
  </div>
</template>

<script>
export default {
  components: {},
  props: {},
  data() {
    return {
      dialogShow: false,
      tableData: []
    };
  },
// 方法
  methods: {
    show(){
      this.dialogShow = true
    }
  },
// 生命周期 - 创建完成（可以访问当前this实例）
  created() {},
// 生命周期 - 挂载完成（可以访问DOM元素）
  mounted() {},
// 销毁
  destroyed() {}
};
</script>
<style lang="scss" scoped>
  .container{
    .code{
      font-size:16px;font-weight:400;color:#999999;margin-bottom: 30px;
    }
    .info{font-size:14px;font-weight:400;color:#666666;display: flex; justify-content: space-between;margin-bottom: 15px;}
  }
</style>